<template>
  <tab-bar class="footer-guider">
    <tab-bar-item path="home">
      <span slot="item-icon">
        <i class="iconfont icon-waimai"></i>
      </span>
      <p slot="item-text">外卖</p>
    </tab-bar-item>

    <tab-bar-item path="order">
      <span slot="item-icon">
        <i class="iconfont icon-dd"></i>
      </span>
      <p slot="item-text">订单</p>
    </tab-bar-item>

    <tab-bar-item path="search">
      <span slot="item-icon">
        <i class="iconfont icon-search"></i>
      </span>
      <p slot="item-text">搜索</p>
    </tab-bar-item>

    <tab-bar-item path="profile">
      <span slot="item-icon">
        <i class="iconfont icon-wodedangxuan"></i>
      </span>
      <p slot="item-text">我的</p>
    </tab-bar-item>
  </tab-bar>
</template>

<script>
import TabBar from "../common/tabbar/TabBar.vue";
import TabBarItem from "../common/tabbar/TabBarItem.vue";
export default {
  name: "FooterGuide",
  components: { TabBar, TabBarItem },
};
</script>

<style lang="less" scoped>
.iconfont {
  font-size: 25px;
}
.footer-guider {
  padding-top: 2px;
}
</style>